<template>
	<view class="hotel-info">
		<view class="c-row-box">
			<view class="c-row-head">
				<view class="c-row-title">酒店信息</view>
			</view>
			<view class="c-row-item">
				<view class="c-row c-row-list">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title">
							<text style="color: red;">*</text>
							酒店名称
						</view>
						<view class="col-text" @click="showSearchDialog" v-if="!isPreview">
							<text>{{ order.hotel == '' ? '请选择' : order.hotel }}</text>
						</view>
						<view class="col-text" v-if="isPreview">
							<text>{{ order.hotel == '' ? '无' : order.hotel }}</text>
						</view>
					</view>
				</view>
				<view class="c-row c-row-list" v-if="!include(orderParams.news_type, [11,12])">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title">
							<text style="color: red;">*</text>
							宴会类型
						</view>
						<view class="col-text">
							<checkbox-group @change="getBanquetType">
								<label>
									<checkbox value="1"
										:checked="Array.isArray(orderParams.banquet_type) && orderParams.banquet_type.includes(1 + '')"
										style="transform:scale(0.5)" />
									午宴
								</label>
								<label>
									<checkbox value="2"
										:checked="Array.isArray(orderParams.banquet_type) && orderParams.banquet_type.includes(2 + '')"
										style="transform:scale(0.5)" />
									晚宴
								</label>
							</checkbox-group>
						</view>
					</view>
				</view>
				<template v-if="!include(orderParams.news_type, [11,12])">
					<view class="c-row c-row-list"
						v-if="hallList.length > 0 || (Array.isArray(orderParams.banquet_hall_id) && orderParams.banquet_hall_id.length > 0)">
						<view class="c-row-col c-row-col-list-item">
							<view class="col-title">
								<text style="color: red;">*</text>
								宴会厅
							</view>
							<view class="col-text">
								<checkbox-group @change="getSelectedHall">
									<label v-for="(item, index) in hallList" :key="index">
										<checkbox :value="item.id + ''"
											:checked="Array.isArray(orderParams.banquet_hall_id) && orderParams.banquet_hall_id.includes(item.id + '')"
											style="transform:scale(0.5)" :disabled="isPreview" />
										{{ item.title }}
									</label>
								</checkbox-group>
							</view>
						</view>
					</view>
					<view class="c-row c-row-list" v-else>
						<view class="c-row-col c-row-col-list-item">
							<view class="col-title">宴会厅</view>
							<view class="col-text"><input type="text" v-model="orderParams.banquet_hall_name"
									:disabled="isPreview" placeholder="请输入" /></view>
						</view>
					</view>
				</template>
			</view>
		</view>

		<hs-search :appendToBody="true" :getSelected="getSelectedHotel" ref="searchDialog"></hs-search>
	</view>
</template>

<script>
	import request from '@/utils/sun.js';
	import dictionary from '@/utils/dictionary.js';
	import {
		include
	} from '@/utils/common.js';
	export default {
		props: {
			isPreview: {
				type: Boolean,
				default () {
					return false;
				}
			},
			order: {
				type: Object,
				default () {
					return {};
				}
			},
			orderParams: {
				type: Object,
				default () {
					return {};
				}
			}
		},
		data() {
			return {
				hallList: []
			};
		},
		beforeCreate() {
			this.dictionary = dictionary;
			this.include = include;
		},
		methods: {
			// 显示搜索
			showSearchDialog() {
				console.log(this);
				console.log(this.$refs);
				// this.searchVisible = true;
				this.$refs['searchDialog'].showSearchDialog('hotel');
			},

			getSelectedHotel(item) {
				this.orderParams.hotel_id = item.id;
				this.order.hotel = item.title;
				// 选择完酒店，获取酒店的厅列表
				if (item.id > 0) {
					this.getHotelHallList(item.id);
				}
			},
			getSelectedHall(e) {
				this.orderParams.banquet_hall_id = e.detail.value;
			},
			getBanquetType(e) {
				console.log(e);
				this.orderParams.banquet_type = e.detail.value;
				console.log(this.orderParams.banquet_type);
			},
			hallChange(e) {
				let index = e.detail.value;
				let current = this.hallList[index];
				if (!current) return false;
				this.orderParams.banquet_hall_id = current.id;
			},
			getHotelHallList(hotelId) {
				let that = this;
				request.request({
					url: '/api/dictionary.hall/index',
					showLoading: true,
					token: true,
					data: {
						store_id: hotelId
					},
					success(res) {
						if (res.code == 200) {
							that.hallList = res.data.list;
						}
					}
				});
			}
		}
	};
</script>

<style lang="less">
	@import url('../../components/common.less');
	@import url('./common.less');

	uni-checkbox-group {
		display: flex;
		flex-wrap: wrap;
		// flex-direction: row-reverse;

		uni-label {
			flex: 0 50%;
			height: 28px;
			// padding: 0 3px;
			text-align: left;
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;
			word-break: break-all;
		}
	}
</style>